<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户列表</title>
</head>
<script src="//unpkg.com/vue/dist/vue.js"></script>
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
<link rel="stylesheet"
	href="resources/css/sweetalert2.css" />
<script src="//unpkg.com/element-ui/lib/index.js"></script>
<script src="resources/js/jquery.min.js"></script>
<script src="resources/js/sweetalert2.min.js"></script>
<body>
<div id="mainApp">
  <el-container style="padding-top:20px;">
	  <el-header style="heighe:10px;">
		  <el-row :gutter="24">
			<el-col :span="8" :xs="8" :sm="8" :md="8" :lg="8">
				<el-breadcrumb class="breadcrumb-inner">
					<el-breadcrumb-item><h2>用户管理</h2></el-breadcrumb-item>
				</el-breadcrumb>
			</el-col>
		  </el-row>
	  </el-header>
	  <el-main>
	  	  <el-card calss="box-card">
	  	  	<el-row :gutter="24">
		  		<el-col :span="8" :xs="8" :sm="8" :md="8" :lg="8">
		  			<span><h4>用户列表</h4></span>
		  		</el-col>
		  	</el-row>
		  	<el-row :gutter="24" >
			  	<el-col :span="8" :xs="8" :sm="8" :md="8" :lg="8" >
			  			<el-button type="primary" @click="addUser" style="margin-left:1500px;">新增</el-button>
			  	</el-col>
		  	</el-row>
		  </el-card>
		  <el-card calss="box-card" style="margin-top:20px">
			  <el-row style="overflow-x:hidden;">
		  		<template>
				  <el-table :data="tableData" style="width:980%;margin:15px auto">
				    <el-table-column label="用户名" width="700" prop="account">
				    </el-table-column>
				    <el-table-column label="姓名" width="700" prop="realName">
				    </el-table-column>
				    <el-table-column label="操作">
				      <template slot-scope="scope">
				        <el-button  type="success" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
				       <!--  <el-button size="mini" type="danger" @click="handleRole(scope.$index, scope.row)">修改角色</el-button> -->
				        <el-button  type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
				      </template>
				    </el-table-column>
				  </el-table>
			  	</template>
			  </el-row>
		  </el-card>
	  </el-main>
  </el-container>
</div>
</body>
<script>
new Vue({
		el:"#mainApp",
	    data:{
	    	tableData: [],
	    	depStr:'',
	    	departmentCode:''
	    },
	    mounted: function (){
	    	//页面加载初始化
	    	this.getUserInfo();
	    },
	    methods: {
	      //获取当前登录用户
    	  getUserInfo(){
	    	  var _this = this;
	    	  $.post("./sys/userinfo", function(data) {
	    		  	var departmentCode = data.departmentCode;
	    		  	_this.departmentCode = departmentCode;
	    		  	_this.findChildDep(departmentCode);
	    	  });
		  },
		  findChildDep(depCode){
			  var _this = this;
			  $.get("./dep/findDepartmentByCode/"+depCode, function(data) {
				  	var depStr = "";
	    		  	if(data!=null){
	    		  		data.forEach(v=>{
	    		  			depStr+=v.departmentCode+",";
	    		  		});
	    		  	}
	    		  	_this.depStr=depStr.substring(0,depStr.length-1);
	    		  	_this.findUser();
	    	  });
		  },
	      //获取用户列表
	      findUser(){
	    	  var _this = this;
	    	  $.post("./sys/findByDepartment/"+_this.depStr, function(data) {
	    		  _this.tableData = data;
	    	  });
	      },
	      handleEdit(index, row) {
	        var userId = row.id;
	        window.location.href = "editUser.html?userId="+userId+"&depCode="+this.departmentCode;
	      },
	      addUser(){
	    	window.location.href = "addUser.html?depCode="+this.departmentCode;
	      }
	    }
	  });
</script>
</html>